<template>
	<view class="p20">
		<view class="p20 bg-fff radius20 mb20" v-for="(item,index) in list" :key="index">
			<view class="color-zs">{{item.service_name}}</view>
			<view class="flex mt20">
				<u-avatar size="90" :src="item.avatar"></u-avatar>
				<view class="flex1 pl20">
					<view class="">{{item.name}}</view>
					<view class="color-999 mt10">{{item.add_time}}</view>
				</view>
				<evaluate-type :type="item.c_type" checked></evaluate-type>
			</view>
			<view class="mt30">{{item.content}}</view>
			<view class="mt32 p20 bg-f8f radius12" v-if="item.reply">
				<text class="color-zs">我的回复：</text>
				<text class="">{{item.reply}}</text>
			</view>
			<view class="mt32" v-else>
				<u-button type="warning" plain @click="form.comment_id=item.id,popup=true">回复ta</u-button>
			</view>
		</view>

		<u-popup v-model="popup" mode="center" width="600" borderRadius="20">
			<view class="p40">
				<view class="tc">回复评价</view>
				<view class="bg-f8f p20 radius16 w-max mt20" style="border: 1rpx dashed #cfcfcf;">
					<u-input type="textarea" height="270" v-model="form.reply" placeholder="请对评进行回复"
						:clearable="false" />
				</view>
				<view class="radius12 bg-zs h84 color-fff mx40 flex row-center mt40" @click="reply">提交</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				popup: false,
				list: "",
				form: {
					comment_id: '',
					reply: '',
				}
			};
		},
		onLoad() {
			this.getList()
		},
		onReachBottom() {
			this.getList('down')
		},
		methods: {
			getList(e) {
				e == 'down' ? this.page++ : this.page = 1
				this.$request('/master/my/commentList', this.$params).then(res => {
					let list = res.data.data
					e == 'down' ? this.list.push(...list) : this.list = list
				})
			},
			reply(e) {
				this.$request('/master/my/reply', this.form).then(res => {
					this.popup = false
					this.$msg(res.msg)
					this.getList()
				})
			},

		}
	}
</script>

<style lang="scss">

</style>
